<!DOCTYPE HTML>
<html>
<head>
    <meta charset="UTF-8">
    <meta blitz-debugger="localhost">
    <meta name="viewport" content="width=1920">
    <title>index</title>
    <link rel="stylesheet" href="./css/base.css"/>
    <link rel="stylesheet" href="./css/login.css"/>
</head>
<body fe-role="Switch" style="width: 1920px; height: 1280px; background-color: #1c1f2b">
<div id="login" class="main" fe-role="Switch">
    <div class="dialog">
        <div class="input-text" id="phone_number" fe-role="Widget" fe-cfg="default_focus:yes" fe-goto="1;1;1;" fe-index="2">
            <input type="text" class="inputtype phone_number_inner" placeholder="输入手机号码"/>
        </div>
        <div class="send-code" id="send-code" fe-role="Widget" fe-index="1">
            获取动态密码
        </div>
        <div class="input-text" id="code_number" fe-role="Widget">
            <input type="text" class="inputtype code_number_inner" placeholder="动态密码"/>
        </div>
        <p  class="login-note">
            登录后：<br />
            1，可在电视、手机、平板同步账户信息；<br />
            2，可参与免费领VIP活动。
        </p>
        <p id="login-button" class="login-button" fe-role="Widget" fe-goto="2;;;">登录</p>

        <p class="line"></p>
        <img class="qrcode" id="qrcode"/>
        <p class="qrcode-tips">请用手机扫码登录</p>
    </div>
</div>

<script src="js/LogUtil.js"></script>
<script src="js/blitz.js"></script>
<script src="../../../FocusEngine.js"></script>
<script src="js/zepto.js"></script>
<script src="js/QrcodeImage.js"></script>
<script>
    var root = FocusEngine.render();
    window.onload = function () {
        this.$phoneInput = $('.phone_number_inner').get(0);
        this.$codeInput = $('.code_number_inner').get(0);
        this.rootWidget = FocusEngine.getWidgetById('login');
        //真焦点不能在输入框上，否则会有光标，注意反注册callBack
        this.callback = this.rootWidget.on('focus', function(e){
            $('#send-code').get(0).focus();
        });
        this.callback2 = this.rootWidget.on('ok', function(e){
            onOK(e);
        });
        //保存上次的手机号更人性化
        this.phoneNumber = '12345678910';
        if(this.phoneNumber){
            this.$phoneInput.value = this.phoneNumber;
        }

        //获取uuid唯一标识客户端，用于扫码登录
        if(yunos){
            var base = blitz.load("base");
            base.getDeviceInfo({}, function (e) {
                if (e) {
                    Log("uuid= " + e.uuid);
                    var qrcontent = 'www.baidu.com?channal=yunos4tv&uuid=' + e.uuid;
                    var qrcodeImage = new QrcodeImage('qrcode', 'demo.login.com');
                    qrcodeImage.update(qrcontent);
                }
            }.bind(this), function (e) {
                Log("fail: " + JSON.stringify(e));
            });
        }
    };

    onOK = function(e){
        var _id = e.target.id;
        Log("login onOK id == " + _id);
        if(_id == "phone_number"){
            this.$phoneInput.focus();
        } else if (_id == "send-code"){
            this.phoneNumber = this.$phoneInput.value;
            FocusEngine.getWidgetById('code_number').focus();
            this.$codeInput.focus();
        } else if (_id == "code_number"){
            this.$codeInput.focus();
        } else if (_id == "login-button"){
            this.phoneNumber = this.$phoneInput.value;
            var code = this.$codeInput.value;
            Log("this.phoneNumber == " + this.phoneNumber + "  code == " + code);
        }
    }
</script>
</body>
</html>
